<script>

import Edit from "@/views/robotOffice/pushunit/edit.vue";
import { page, remove } from "@/api/robot/robotTaskAdPushUnit";
import { globalLoading } from "@/utils/service";

export default {
  name: "index",
  components: { Edit },
  data() {
    return {
      query: {
        name: "",
        adId: undefined,
        taskId: undefined,
        id: undefined,
        lookMe: true,
        pageSize: 10,
        pageNo: 1
      },
      table: {
        loading: false,
        data: [],
        total: 0,
        pages: 0
      }
    };
  },
  mounted() {
    this.getTable();
  },
  methods: {
    createHandler() {
      this.dialog.show = true;
    },
    getTable() {
      this.table.loading = true;
      page(this.query).then(r => {
        this.table.data = r.list;
        this.table.total = r.total;
        this.table.pages = r.pages;
      }).finally(() => {
        this.table.loading = false;
      });
    },
    queryReset(){
      this.query.name = ""
      this.query.adId = undefined
      this.query.taskId = undefined
      this.query.id = undefined
      this.getTable();
    },
    removeReq(id) {
      let loading = globalLoading(this);
      remove(id).then(r => {
        this.$message.success("操作成功");
        this.getTable();
      }).finally(() => {
        loading.close();
      });
    },
    pageSizeChange(v) {
      this.query.pageSize = v;
      this.getTable();
    },
    pageNoChange(v) {
      this.query.pageNo = v;
      this.getTable();
    }
  }
};
</script>

<template>
  <div style="margin:10px 0">
    <div>
      <el-form ref="query" :model="query" :inline="true" size="mini">
        <el-form-item prop="lookMe" label="查看范围" v-role="'超级管理员'">
          <el-radio-group v-model="query.lookMe" @input="getTable">
            <el-radio-button :label=true>自己</el-radio-button>
            <el-radio-button :label=false>所有人</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="编号" prop="taskId">
          <el-input v-model="query.id" placeholder="发布任务单元编号(精确)"></el-input>
        </el-form-item>
        <el-form-item label="名称" prop="name">
          <el-input v-model="query.name" placeholder="根据名称搜索(模糊)"></el-input>
        </el-form-item>
        <el-form-item label="管理员编号" prop="adId" v-role="'超级管理员'" v-if="!query.lookMe">
          <el-input v-model="query.adId" placeholder="管理员编号(精确)"></el-input>
        </el-form-item>
        <el-form-item label="任务编号" prop="taskId">
          <el-input v-model="query.taskId" placeholder="任务编号(精确)"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getTable">搜索</el-button>
          <el-button type="info" @click="queryReset">重置</el-button>
        </el-form-item>
      </el-form>
      <div>
        <el-button size="mini" type="success" @click="$refs.edit.createHandler()">新增发布单元</el-button>
      </div>
    </div>

    <div style="margin: 10px 0">
      <el-table
        :row-style="{height: '20px'}"
        :cell-style="{padding: '0px'}"
        height="75vh"
        :data="table.data"
        v-loading="table.loading"
      >
        <el-table-column prop="id" label="编号" />
        <el-table-column prop="name" label="单位名称" align="center" show-overflow-tooltip width="350" />
        <el-table-column prop="robotTaskId" label="任务编号" align="center" />
        <el-table-column prop="adId" label="管理员编号" align="center" />
        <el-table-column prop="createTime" label="创建时间" align="center" />
        <el-table-column prop="updateTime" label="修改时间" align="center" />
        <el-table-column label="操作" align="center">
          <template slot-scope="{row}">
            <el-button
              size="medium"
              type="text"
              style="font-weight: bold;"
              @click="$refs.edit.updateHandler(row)"
            >
              编辑
            </el-button>

            <el-popconfirm
              style="margin-left: 10px"
              title="确认删除吗?"
              @confirm="removeReq(row.id)"
            >
              <el-button slot="reference" type="text" style="color: #ff4757;font-weight: bold">删除</el-button>
            </el-popconfirm>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div>
      <div style="text-align: center;margin: 10px 0">
        <el-pagination
          background
          layout="sizes,prev, pager, next, jumper, ->, total"
          :total="table.total"
          :page-size="query.pageSize"
          :current-page="query.pageNo"
          :page-count="table.pages"
          :page-sizes="[10,30,50,100]"
          @size-change="pageSizeChange"
          @current-change="pageNoChange"
        >
        </el-pagination>
      </div>
    </div>

    <edit ref="edit" @refreshTable="getTable"></edit>
  </div>
</template>

<style scoped>

</style>